<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
    <title>芳小微宣</title>
    <!-- 引入 WeUI -->
    <link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css">
    <link rel="stylesheet" href="css/dropload.css">
    <script src="js/jquery.min.js"> </script>
    <script src="js/dropload.min.js"></script>
    <script src="js/index.js"></script>
    <link rel="stylesheet" href="css/index.css">
    <style>
        .dropload-down {
            width: 100%;
            height: 50px;
        }
        .yuyue{
            width: 65px;
          /*  position: relative;
            bottom: 9px;
            left: 8px;*/
            background: #ff0000;
            height: 30px;
            color: #fff;
            border: 0px;
            border-radius: 5px;
            font-size: 5rem;
        }
        .list-center{
            width: 60%;
            float: left;
            margin: 5px 2%;
        }
        .list-word{
            width: 100%;
            display: inline-block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 5rem;
            background: #fff;
        }
        .imgSin{
            display: inline-block;
        }
        .Photo_left img{
            margin-top: 13px;
        }
        .yuyueDiv{
            width: 23%;float: left; text-align: center;margin-top: 15px;
        }
    </style>
</head>
<body class="tzggPage">
<div class="weui_cells_title">我的基地列表</div>
<div class="listAll">
    <div class="content">
       <!-- <div class="imgSin">
                <div class="Photo_left"><img src="images/address.png"/></div>
                <div class="list-center">
                    <div class="list-word">的风范热的风范热的风范热的风范热的风范热</div>
                    <div class="list-info">
                        <div style="float: left">admin</div>
                        <div style="float: right">2017-01-02</div>
                    </div>
                </div>
                <div class="yuyueDiv"><button class="yuyue">预约</button></div>
        </div>-->
    </div>
</div>
<div class="returnBtn">
    <a href="jdList.html">
        <img src="images/return.png" style="width: 25px;padding-top: 4px;"><br>
        <span>返回</span>
    </a>
</div>
<div class="weui_dialog_alert" style="display: none;">
    <div class="weui_mask"></div>
    <div class="weui_dialog">
        <div class="weui_dialog_hd"> <strong class="weui_dialog_title">警告</strong>
        </div>
        <div class="weui_dialog_bd">弹窗内容，告知当前页面信息等</div>
        <div class="weui_dialog_ft">
            <a href="javascript:;" class="weui_btn_dialog primary">确定</a>
        </div>
    </div>
</div>
<script>
    $.weui = {};
    $.weui.alert = function(options,sureEvent){
        options = $.extend({title: '提示', text: '提示内容'}, options);
        var $alert = $('.weui_dialog_alert');
        $alert.find('.weui_dialog_title').text(options.title);
        $alert.find('.weui_dialog_bd').text(options.text);
        $alert.on('touchend click', '.weui_btn_dialog', function(){
            $alert.hide();
            if(sureEvent){
                sureEvent();
            }
            //阻止事件冒泡
            // event.stopPropagation();
            return false;
        });
        $(".weui_mask").click(function(){
            $alert.hide();
        });
        $alert.show();
    };

    $(function(){
        // 页数
        var page = 0;
        // 每页展示10个
        var size = 10;
        // dropload
      $('.listAll').dropload({
            scrollArea : window,
            loadDownFn : function(me){
                page++;
                // 拼接HTML
                var result = '';
                $.ajax({
                    type: 'GET',
                    url: path + '/api/weixin/myEduAppt?page='+page+'&size='+size+'&token='+window.localStorage.getItem("token"),
                    dataType: 'json',
                    success: function(data){
                        if(data.code == 501){
                            window.location.href = "login.html";
                            return;
                        }
                        var arrLen = data.eduApptList.length;
                        if(arrLen > 0){
                                for(var i=0; i<arrLen; i++){
                                    result += '<div class="imgSin"> <div class="Photo_left"><img src="images/address.png"/></div>' +
                                            '<div class="list-center"><div class="list-word">'+ data.eduApptList[i].eduName +'</div>' +
                                            '<div class="list-info"><div style="float: left">'+ data.eduApptList[i].className +'</div><div style="float: right">'+ data.eduApptList[i].apptDate +'</div> </div></div>' +
                                            ' <div class="yuyueDiv"><button class="yuyue" title="'+ data.eduApptList[i].id +'">取消</button></div> </div>';

                                }
                        }else{
                            // 如果没有数据
                            // 锁定
                            me.lock();
                            // 无数据
                            me.noData();
                        }
                        // 插入数据到页面，放到最后面
                         $('.content').append(result);
                        // 每次数据插入，必须重置
                         me.resetload();

                        $(".yuyue").click(function(){
                            var id = $(this).attr("title");
                            $.weui.alert({text: "确定取消预约吗?"},function(){
                                //删除数据
                                $.ajax({
                                    type : "POST",
                                    url : path + "/api/weixin/cancelEduAppt",
                                    data : {
                                        "token" : window.localStorage.getItem("token"),
                                        "id" : id
                                    },
                                    dataType : 'json',
                                    success : function(msg) {
                                        if(msg.code == 0){
                                            window.location.href = "myOrder.html";
                                        }else if(msg.code == 501){
                                            window.location.href = "login.html";
                                        }
                                    }
                                })
                            });
                        });
                    },
                    error: function(xhr, type){
                        // 即使加载出错，也得重置
                        me.resetload();
                    }
                });
            }
        });
    });

    $(".content").on('click','.imgCheck',function(){
        if($(this).attr("src").indexOf("selected")>0){
            $(this).attr("src","images/noselect.png");
        }else {
            $(this).attr("src","images/selected.png");
        }
    });

    $("#returnIndex").click(function(){
        window.location.href = "index.html";
    });
    $("#Myorder").click(function(){
        window.location.href = "index.html";
    });
</script>
</body>
</html>